{# **
 * Copyright since 2007 PrestaShop SA and Contributors
 * PrestaShop is an International Registered Trademark & Property of PrestaShop SA
 *
 * NOTICE OF LICENSE
 *
 * This source file is subject to the Open Software License (OSL 3.0)
 * that is bundled with this package in the file LICENSE.md.
 * It is also available through the world-wide-web at this URL:
 * https://opensource.org/licenses/OSL-3.0
 * If you did not receive a copy of the license and are unable to
 * obtain it through the world-wide-web, please send an email
 * to license@prestashop.com so we can send you a copy immediately.
 *
 * DISCLAIMER
 *
 * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
 * versions in the future. If you wish to customize PrestaShop for your
 * needs please refer to https://devdocs.prestashop.com/ for more information.
 *
 * @author    PrestaShop SA and Contributors <contact@prestashop.com>
 * @copyright Since 2007 PrestaShop SA and Contributors
 * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
 * #}
{% extends '@PrestaShop/Admin/TwigTemplateForm/prestashop_ui_kit_base.html.twig' %}

{% block category_tags_collection_row %}
  {%- set attr = attr|merge({class: (attr.class|default('') ~ ' pstaggerTagsWrapper form-group d-block')|trim}) -%}
  {%- set attr = attr|merge({'data-prototype': form_row(prototype), 'data-prototype-name': prototype.vars.name}) -%}
  <div {{ block('widget_attributes') }}>
    {{ block('form_rows') }}
  </div>
{% endblock %}

{% block product_category_row %}
  {%- set attr = attr|merge({class: (attr.class|default('') ~ ' pstaggerTag tag-item')|trim}) -%}

  <span {{ block('widget_attributes') }}>
    {{ form_widget(form.display_name) }}
    {{ form_widget(form.name) }}
    {% set isRemovable = (form.vars.data.removable is defined and form.vars.data.removable) %}
    <a class="pstaggerClosingCross {% if not isRemovable %}d-none{% endif %}" href="#">x</a>
    {{ form_widget(form.id, {attr: {class: 'category-id-input'}}) }}
  </span>
{% endblock %}

{% block category_tree_selector_row %}
  <template id="categories-modal-template">
    <div id="categories-modal-content">
      {{ form_row(form.product_categories) }}

      <fieldset class="form-group tree-fieldset d-none">
        <div class="ui-widget">
          <div class="search search-with-icon">
            <input type="text" id="ps-select-product-category" class="form-control autocomplete search mb-1 ui-autocomplete-input" placeholder="{{ 'Search categories'|trans({}, 'Admin.Catalog.Help') }}" autocomplete="off">
          </div>

          <label class="form-control-label text-uppercase">{{ 'Associated categories'|trans({}, 'Admin.Catalog.Feature') }}</label>
          {{ form_row(form.category_tree) }}
        </div>
      </fieldset>

      <div class="categories-tree-loader">
        <div class="spinner m-auto d-block"></div>
      </div>

      <div class="category-tree-footer">
        {{ form_widget(form.cancel_btn) }}
        {{ form_widget(form.apply_btn) }}
      </div>
    </div>
  </template>
{% endblock %}

{% block category_tree_entry_row %}
  <li class="category-tree-element">
    <div class="checkbox category-tree-inputs">
      {{ form_widget(form) }}
    </div>
    <ul class="children-list"></ul>
  </li>
{% endblock %}

{% block category_tree_collection_row %}
<div class="category-tree-container">
  <div class="category-tree-overflow js-category-tree-overflow">
    {%- set attr = attr|merge({'data-prototype': form_row(prototype), 'data-prototype-name': prototype.vars.name}) -%}
    {%- set attr = attr|merge({class: (attr.class|default('') ~ ' js-category-tree-list category-tree')|trim}) -%}
    <ul {{ block('widget_attributes') }}>
      {{- block('form_rows') -}}
    </ul>
  </div>
</div>
{% endblock %}

{% block category_filter_row %}
  <div class="d-inline-block dropdown dropdown-clickable product_list_category_filter">
    <button
      class="btn btn-outline-secondary dropdown-toggle"
      type="button"
      data-toggle="dropdown"
      aria-haspopup="true"
      aria-expanded="false"
    >
      {{ 'Filter by categories'|trans({}, 'Admin.Actions') }}
      {# Display selected category if present #}
      {%- for choice in choices -%}
        {% if form.vars.data and choice.value == form.vars.data %}
          ({{ choice.label }})
        {% endif %}
      {%- endfor -%}
    </button>
    <div class="dropdown-menu category-filter-menu">
      <div class="categories-tree-actions">
        <button type="button" class="category_tree_filter_expand btn">
          <i class="material-icons">expand_more</i>
          {{ 'Expand'|trans({}, 'Admin.Actions') }}
        </button>
        <button type="button" class="category_tree_filter_collapse btn">
          <i class="material-icons">expand_less</i>
          {{ 'Collapse'|trans({}, 'Admin.Actions') }}
        </button>
        <button type="button" class="category_tree_filter_reset btn">
          <i class="material-icons">radio_button_unchecked</i>
          {{ 'Unselect'|trans({}, 'Admin.Actions') }}
        </button>
      </div>
      {{ form_widget(form) }}
    </div>
  </div>
  {% if form.vars.data is not empty %}
  <button class="btn btn-link category_tree_filter_reset" type="button">
    <i class="material-icons">clear</i> Clear filter
  </button>
  {% endif %}
{% endblock %}

{% block category_filter_widget -%}
  <div {{ block('widget_container_attributes') }}>
    <ul class="category-tree">
      {%- for child in nested_tree %}
        {{ block('category_filter_item_widget') }}
      {% endfor -%}
    </ul>
  </div>
{%- endblock %}

{% block category_filter_item_widget -%}
  <li class="category-node{% if child.children is defined and child.children|length %} more{% endif %}">
    <div class="form-check form-check-radio form-radio radio category-label">
      {{ child.name }}
      <label class="form-check-label">
        <input type="radio" name="{{ form.vars.id }}" value="{{ child.id_category }}" {% if child.id_category == form.vars.data %}checked="checked"{% endif %}>
        <i class="form-check-round"></i>
      </label>
    </div>

    {% if child.children is defined %}
      <ul class="category-children d-none">
        {% for item in child.children %}
          {% set child = item %}
          {{ block('category_filter_item_widget') }}
        {% endfor -%}
      </ul>
    {% endif %}
  </li>
{%- endblock %}
